<template>
	<view class="message">
		<view class="message-main">
			<view class="message-header">
				<view class="message-ques">快速问答</view>
				<view class="message-top" v-for="item in qusetionlist" :key="item.question" @click="clickto(item.question)">
					<view class="text">{{item.question}}</view> 
				</view> 
					<message v-for="item in anslist" :key="item.id" :obj="item" @clickes="clickes"/>
			</view> 
		</view>
	</view>
</template>

<script>
	import {$_initquestion,$_question} from "@/apis/index.js"
	import message from "@/components/message/message.vue"
	export default {
		components:{
			message
		},
		data() {
			return {
				qusetionlist:[],
				// ans :  "['您好,楼盘咨询热线']"
				// id : 1
				// question :  "楼盘底价"
				anslist:[]
			};
		},
		async onLoad() {
			let res=await $_initquestion()
			this.qusetionlist=res.data.data
			// console.log(49,this.qusetionlist);
		},
		methods:{
			async clickto(question){ 
				this.anslist.push({types:0,value:question})
				let res=await $_question({question:question})
				 
				let str=res.data.data[0].ans 
				this.anslist.push({types :1,value:str})	
				// console.log(44,str);
				// console.log(45,this.anslist);
			},
			clickes(value){
				this.clickto(value)
				// console.log(47,value);
			}
		}
	}
</script>

<style lang="scss">
uni-page-wrapper{
	background-color: red!important;
}
.uni-body pages-message-message uni-app{
	background-color:red!important;
}
.message{
	// background-color: #ecedef;
	width: 100%;
	height: 100%;
	.message-main{ 
		margin: 10px auto;
		width: 80%;
		height: 150px;
		background-color:#ecedef;
		 .message-header{
			 margin-left: 10px;
			.message-ques{
				padding-top: 15px;
			} 
		 }
	}
}
.text{
	// margin-left: 10px;
	font-size: 14px;
	line-height: 14px;
	padding: 10px;
}
.img{
	width: 50px;
	height: 50px;
	border-radius: 50%;
}

</style>
